<template>
<a-layout id="components-layout-demo-custom-trigger">
    <a-layout-sider v-model="collapsed" :trigger="null" collapsible>
      <div class="logo">欢迎你，{{ username }}
        <leftmenu :menu_number='3'></leftmenu>
      </div>

      
          </a-layout-sider>

        <a-layout>
<headmenu></headmenu>

          <a-layout-content
        :style="{
          margin: '24px 16px',
          padding: '24px',
          background: '#fff',
          minHeight: '500px',
        }"
      >
    <h2>审批具体信息</h2>


          <a-breadcrumb>
    <a-breadcrumb-item>我申请的工单</a-breadcrumb-item>
    <!-- <a-breadcrumb-item><a href="">Application Center</a></a-breadcrumb-item> -->
    <a-breadcrumb-item><a href="/mywork">我申请的工单</a></a-breadcrumb-item>
    <a-breadcrumb-item>具体审批信息</a-breadcrumb-item>
  </a-breadcrumb>
    <!-- {{data_list[0].base64img}} -->
        <!-- <div v-if="key=='base64img'">{{base64的图片}}:<img :src="'data:image/jpg;base64,'+data_list[0].base64img" alt=""></div> -->
  base64图片：：：<img :src="'data:image/'+img_list.type+';base64,'+img_list.base64img" style="height:50px;width:90px"/>

  云端图片：：<img :src="img_list.upyunimg" alt="" style="height:50px;width:90px">
    <div v-for="(value, key) in work_data" :key="key">
        <div v-if="key == 'img'">{{key}}:<img :src="value" alt="" style="height: 50px"></div>
        <div v-else>{{key}}:{{value}}</div>
    </div>
    
    
    
    <a-steps :current=sp_index()>
      <a-step :title="i.username" :description="is_sp(i.state, i.refuse)" v-for="i in data_list" :key="i.username"> </a-step>
      
    </a-steps>

    </a-layout-content>
  </a-layout>
          </a-layout>
</template>

<script>
import { get_mywork } from "./axios_http/api";
// 导入组件
import leftmenu from "./leftmenu.vue";
import headmenu from './headmenu.vue';
export default {
  data() {
    return {
      work_id: this.$route.query.work_id,
      data_list: [],
      img_list:[],
      work_data:{},
            collapsed: false,
      username: localStorage.getItem("username"),
    };
  },
  methods: {
    
      is_sp(state, refuse){
          if(!state){
              return "待审批"
          }else if(state == 1){
              return "审批通过\n    审批意见" + refuse
          }else if(state == 2){
              return "审批未通过\n    审批意见" + refuse
          }
      },
      sp_index(){
          for(var i = 0; i < this.data_list.length; i++){
              if(this.data_list[i].state == 0){
                  return i
              }
              return this.data_list.length-1
          }
      }
  },
    components: {
    leftmenu: leftmenu,
        headmenu:headmenu,
  },
  created() {
      get_mywork(this.work_id).then((resp) => {
          console.log(resp)
          this.data_list = resp.data
          this.work_data = resp.data[0].work_data
          this.img_list = resp.data[0]

      })
  },
};
</script>